<template>
  <j-modal
    :title="title"
    :visible="visible"
    width="780px"
    :confirmLoading="confirmLoading || confirmLoading1"
    @cancel="handleCancel"
    v-drag
  >
    <div>
      <a-form-model
        :rules="rules"
        :model="dataForm"
        ref="form"
        :label-col="labelCol"
        :wrapper-col="wrapperCol"
        v-enterToNext
      >
        <div>
          <div style="font-size: 17px; font-weight: bold; margin-bottom: 10px">{{ $t('参数设置') }}</div>
          <a-form-model-item prop="appid" ref="appid" label="APPID:">
            <a-input v-model="dataForm.appid"></a-input>
          </a-form-model-item>
          <a-form-model-item prop="pid" ref="pid" label="PID:">
            <a-input v-model="dataForm.pid"></a-input>
          </a-form-model-item>
          <a-form-model-item prop="validTime" ref="validTime" :label="$t('支付有效期')" style="margin-bottom: 0px">
            <a-input v-model="dataForm.validTime" :suffix="$t('分钟')"></a-input>
          </a-form-model-item>
          <div style="margin-left: 11%; margin-bottom: 10px; color: #e38127">
            {{ $t('（生成支付二维码后需在该设定的时间内扫码并完成支付，否则会订单失效）') }}
          </div>
          <a-button
            @click="handleOk(false)"
            :loading="confirmLoading"
            style="background-color: #f96455; color: #ffffff; margin: 10px 150px"
            >{{ $t('保存') }}</a-button
          >
        </div>
        <div>
          <div style="font-size: 17px; font-weight: bold; margin-bottom: 10px">{{ $t('环境配置') }}</div>
          <div style="margin: 0 0 14px 50px">
            <i18n path="rsa-btn" tag="span">
              <a place="btntxt" @click="getRSA">{{ $t('生成RSA秘钥') }}</a>
            </i18n>
          </div>
          <a-row>
            <a-col :span="21">
              <a-form-model-item prop="publicKey" ref="publicKey" :label="$t('应用公钥')">
                <a-textarea v-model="dataForm.publicKey" :rows="4" />
              </a-form-model-item>
            </a-col>
            <a-col :span="3">
              <a-button @click="copy" style="background-color: #f96455; color: #ffffff">{{ $t('复制') }}</a-button>
            </a-col>
          </a-row>
          <div style="margin: 0 0 14px 50px">
            {{ $t('第二步：复制第一步中生成的公钥信息，设置到支付宝商户平台中的“设置公钥”中。') }}
          </div>
          <div style="margin: 0 0 14px 50px">
            {{ $t('第三步：在支付宝账户平台中找到支付宝公钥，复制并设置到系统中。') }}
          </div>
          <a-row>
            <a-col :span="21">
              <a-form-model-item prop="alipayKey" ref="alipayKey" :label="$t('支付宝公钥')">
                <a-textarea v-model="dataForm.alipayKey" :rows="4" />
              </a-form-model-item>
            </a-col>
            <a-col :span="3">
              <a-button
                @click="handleOk"
                :loading="confirmLoading1"
                style="background-color: #f96455; color: #ffffff"
                >{{ $t('保存') }}</a-button
              >
            </a-col>
          </a-row>
        </div>
      </a-form-model>
    </div>
    <template slot="footer">
      <a-button @click="handleCancel">{{ $t('关闭') }}</a-button>
    </template>
  </j-modal>
</template>

<script>
import { httpAction, getAction } from '@/api/manage'
export default {
  name: 'AliPayModal',
  components: {},
  data() {
    return {
      model: {},
      title: '',
      visible: false,
      confirmLoading: false,
      confirmLoading1: false,
      dataForm: {
        appid: '',
        pid: '',
        validTime: '10',
        publicKey: '',
        privateKey: '',
        alipayKey: '',
      },
      publicKey: '',
      labelCol: {
        xs: { span: 20 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 20 },
        sm: { span: 18 },
      },
      rules: {
        appid: [{ required: true, message: this.$t('请输入AppId') }],
        pid: [{ required: true, message: this.$t('请输入PID') }],
        validTime: [{ required: true, message: this.$t('请输入有效期') }],
      },
      url: {
        add: '/pay/bisPayChannelAlipay/add',
        edit: '/pay/bisPayChannelAlipay/edit',
      },
    }
  },
  mounted() {},
  methods: {
    edit() {
      let that = this
      that.visible = true
      getAction('/pay/bisPayChannelAlipay/list').then((res) => {
        if (res.success) {
          that.dataForm = Object.assign({}, res.result.records[0])
          that.dataForm.validTime = '10'
        }
      })
    },
    copy() {
      let cInput = document.createElement('input')
      cInput.value = this.dataForm.publicKey
      document.body.appendChild(cInput)
      cInput.select()
      document.execCommand('copy')
      if (document.execCommand('copy')) {
        this.$message.success(this.$t('复制成功'))
      }
    },
    getRSA() {
      getAction('/pay/bisPayChannelAlipay/generateKeyPair').then((res) => {
        if (res.success) {
          this.$set(this.dataForm, 'publicKey', res.result.publicKey)
          this.dataForm.privateKey = res.result.privateKey
        }
      })
    },
    handleOk(state) {
      let param = {}
      param = this.dataForm
      let url = ''
      let method = ''
      if (this.dataForm.id) {
        url = this.url.edit
        method = 'put'
      } else {
        url = this.url.add
        method = 'post'
      }
      if (state == false) {
        this.$refs.form.validate((valid) => {
          if (valid) {
            this.confirmLoading = true
            httpAction(url, param, method)
              .then((res) => {
                if (res.success) {
                  this.$message.success(res.message)
                  this.edit({ value: 2 })
                } else {
                  this.$message.warning(res.message)
                }
              })
              .finally(() => {
                this.confirmLoading = false
              })
          }
        })
      }
      if (state != false) {
        this.confirmLoading1 = true
        httpAction(url, param, method)
          .then((res) => {
            if (res.success) {
              this.$message.success(res.message)
              this.close()
            } else {
              this.$message.warning(res.message)
            }
          })
          .finally(() => {
            this.confirmLoading1 = false
          })
      }
    },
    close() {
      this.$emit('close')
      this.visible = false
    },
    handleCancel() {
      this.close()
    },
  },
}
</script>
<style scoped>
</style>